<template>
		<view class="path-item" @tap="goConfirmOrder(data)">
			<view class="item-left">
				<image class="addressImage" src="../../static/image/icon/dizhiguanli.png" mode=""></image>
				<view class="item-info">
					<view class="name-phone">
						<view class="name">{{data.name}}</view>
						<view class="phone">{{data.tel}}</view>
					</view>
					<view class="detialAddress">
						<view class="address">{{data.province}}--{{data.city}}--{{data.district}}--{{data.address}}</view>
						<view v-if="disable">
							<view class="addressDefault" v-if="data.isDefault == 1 ? true : false">默认</view>
						</view>
					</view>
				</view>
			</view>
			<view class="item-right" v-if="disable">
				<text class="operateBtn" @tap="deletePath(data,index)">删除</text>
				<text class="operateBtn" @tap="reviseAddPath(index)">修改</text>
			</view>
		</view>
</template>

<script>
	import $http from '../../common/api/request.js'
	export default{
		props:{
			data:Object,
			index:Number,
			disable:Boolean
		},
		methods: {
			// 点击修改地址 将地址中中的数据作为对象传递过去
			reviseAddPath(index){
				console.log(index);
				let pathObj = JSON.stringify({
					index:index,
					item:this.data
				})
				uni.navigateTo({
					url:"/pages/add-path/add-path?data="+pathObj+""
				})
			},
			// 删除地址
			deletePath(item,index){
				uni.showModal({
					title:'提示',
					content:'确定要删除地址吗',
					success: (res) => {
						if(res.confirm){
							$http.request({
								url:'/deletAddress',
								method:'POST',
								header:{
									token:true
								},
								data:{
									addressId:item.id
								}
							}).then((res)=>{
								uni.showToast({
									title:'删除成功',
									icon:'none'
								})
								this.__initAddress();
							}).catch(()=>{
								uni.showToast({
									title:'删除失败',
									icon:'none'
								})
							})
						}else{
							return;
						}
					}
				})
			},
			// 跳转新增地址页面
			// 判断是否是从确认订单页面过来的
			goConfirmOrder(item){
				if(this.isSelectedPath){
					uni.$emit('selectPathItem',item);
					uni.navigateBack({
						delta:1
					})
				}
			}
		}
	}
</script>

<style scoped>
	.path-item{
		padding:10rpx 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1rpx solid #e1e1e1;
	}
	.item-left{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.item-info{
		display: flex;
		padding-left: 15rpx;
		flex-direction: column;
		align-items: flex-start;
	}
	.name-phone{
		width: 300rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.addressImage{
		width: 40rpx;
		height: 40rpx;
	}
	.pen{
		width: 40rpx;
		height: 40rpx;
	}
	.add-path{
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 80rpx;
		background-color: #49bdfb;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
	}
	.detialAddress{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.addressDefault{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 60rpx;
		background-color: #49bdfb;
		color: white;
		border-radius: 50rpx;
		font-size: 18rpx;
		margin-left: 20rpx;
	}
	.item-right{
		width: 140rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		color: #b1b1b1;
	}
	.operateBtn{
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 20rpx;
		width: 60rpx;
		height: 30rpx;
		border: 2rpx solid #49bdfb;
		border-radius: 50rpx;
		color: #49bdfb;
	}
</style>